
<link href="${rc.getContextPath()}/manage/css/menu/jquery-accordion-menu.css?v=${ver}" rel="stylesheet">
<link href="${rc.getContextPath()}/manage/css/menu/font-awesome.css?v=${ver}" rel="stylesheet">
<script src="${rc.getContextPath()}/manage/js/jquery-accordion-menu.js" type="text/javascript"></script>
<style>
.menu {
    width: 250px;
    padding: 1px 1px;
    border: solid 1px #CCC;
    float: left;
}

#demo-list a {
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.read{
    content: url('${rc.getContextPath()}/manage/images/message/message_read.png');
    margin-right: 10px;
}

.unread
{
content: url('${rc.getContextPath()}/manage/images/message/message_unread.png');
margin-right: 10px;
}
</style>
<div class="message">

    <div class="menu" layoutH="0">
        <div id="jquery-accordion-menu" class="jquery-accordion-menu white">
            <ul id="demo-list">
                <li class="active"><a href="#" onclick="unreadMessage()"><i class="unread"></i>未读消息 </a>
                <#if unreadCount!''>
                <span
                    class="jquery-accordion-menu-label">${unreadCount} </span>
                    </#if>
                </li>
                <li><a href="#" onclick="hisMessage()"><i class="read"></i>历史消息</a>
                </li>
            </ul>
        </div>
    </div>
     <div class="pageFormContent" style="margin-left: 255px;padding:1px 1px">
         <div id="detail" style="border:1px dotted #B8D0D6;" >
         </div>
         </div>
</div>
<script type="text/javascript">
$("#detail",navTab.getCurrentPanel()).ready(function () {          
     $("#detail",navTab.getCurrentPanel()).loadUrl("${rc.getContextPath()}/manage/message/unReadMessage?navTabId=${navTabId!''}",null,function(){
                 $("#detail",navTab.getCurrentPanel()).find("[layoutH]").layoutH();
            });
});

    jQuery(document).ready(function() {
        jQuery("#jquery-accordion-menu").jqueryAccordionMenu();

    });

    $(function() {
        //顶部导航切换
        $("#demo-list li").click(function() {
            $("#demo-list li.active").removeClass("active")
            $(this).addClass("active");
        });
        var count = parseInt('${unreadCount}');
        if (count) {
        	$('#circle:first').addClass('twinkling');
			$("#messages:first").text(count);
        } else {
        	$('#circle:first').removeClass('twinkling');
        }
    })
    function hisMessage()
    {
         $("#detail",navTab.getCurrentPanel()).loadUrl("${rc.getContextPath()}/manage/message/hisMessage?navTabId=${navTabId!''}",null,function(){
             $("#detail",navTab.getCurrentPanel()).find("[layoutH]").layoutH();
        });
    }
    
    function unreadMessage()
    {
         $("#detail",navTab.getCurrentPanel()).loadUrl("${rc.getContextPath()}/manage/message/unReadMessage?navTabId=${navTabId!''}",null,function(){
             $("#detail",navTab.getCurrentPanel()).find("[layoutH]").layoutH();
        });
    }
</script>
